<template>
  <div>
    <k-form-design
      @save="handleSave"
      showToolbarsText
      @close="handleClose"
      ref="KFormDesign"
      title="表单设计器">
    </k-form-design>
  </div>
</template>

<script>
import { saveJson, getObj } from '@/api/dynamicForm/design'
export default {
  name: 'DesignForm',
  data () {
    return {
      jsonData: {}
    }
  },
  methods: {
    handleSave (jsonData) {
      const id = this.$route.params.id
      saveJson({
        id: id,
        jsonData: jsonData
      }).then(res => {
        this.$message.success('保存成功')
      })
    },
    handleClose () {
      // this.$message.success('触发关闭方法')
      this.$confirm({
        title: '是否确定要退出？',
        content: '先检查是否进行保存，然后再进行退出.',
        onOk: () => {
          this.$router.go(-1)
        },
        onCancel () {}
      })
    }
  },
  created () {
    const id = this.$route.params.id
    getObj(id).then(res => {
      this.$nextTick(() => {
        if (res.data.jsonData) {
          const jsondata = JSON.parse(res.data.jsonData)
          this.$refs.KFormDesign.handleSetData(jsondata)
        }
      })
    })
  }
}
</script>

<style scoped>

</style>
